<template>
	<div class="cart">
		<head-nav-bar>
			<div slot="center">
				<span>购物车</span>
				<span>({{cartLength}})</span>
			</div>
		</head-nav-bar>
		<cart-list
				@checkChange="checkChange"
			/>
		<cart-bottom-bar :selected="selectedNum"/>
	</div>
</template>

<script>
	import headNavBar from 'components/common/headNavBar/headNavBar'
	import CartList from './CartComps/CartList'
	import CartBottomBar from './CartComps/CartBottomBar'
	export default{
		name:'cart',
		components:{
			headNavBar,
			CartList,
			CartBottomBar
		},
		computed:{
			cartLength(){
				return this.$store.state.cartList.length;
			}
		},
		data(){
			return {
				selectedNum:0
			}
		},
		methods:{
			checkChange(selected){
				this.selectedNum = selected;
			}
		}
		
	}
</script>

<style>
</style>
